<template>
  <div>
      <div style="margin: 40px" class="box">
      <el-card class="box-card" shadow="hover">
        <p>个人中心</p>
        <span class="xx" @click="close()">X</span>
        <div class="form">
          <div class="tex">
            <label for="">姓名</label>
            <span>*</span>
            <!-- <input class="s2" type="text" v-model="form.parameter" /> -->
            <el-input
              type="textarea"
              autosize
              placeholder="请输入内容"
              v-model="form.parameter"
            >
            </el-input>
          </div>
          <div class="tex">
            <label for="">密码</label>
            <span>*</span>
            <!-- <input class="s2" type="textarea"  autosize v-model="form.yingxiang" /> -->
            <el-input
              type="textarea"
              autosize
              placeholder="请输入内容"
              v-model="form.yingxiang"
            >
            </el-input>
          </div>
          <div class="tex">
            <label for="">职位</label>
            <span>*</span>
            <!-- <input class="s2" type="text" v-model="form.Endurance" /> -->
            <el-input
              type="textarea"
              autosize
              placeholder="请输入内容"
              v-model="form.Endurance"
            >
            </el-input>
          </div>
          <div class="tex"></div>

          <div class="uplod">
            <label for="">头像上传</label>
            <span>*</span>
            <el-upload
              class="upload-demo"
              action="http://192.168.3.180:7001/api/uploadPicture"
              :on-preview="handlePreview"
              :on-remove="handleRemove"
              list-type="picture"
            >

              <el-button size="small" type="primary">点击上传</el-button>
            </el-upload>
            <span id="photo"
              ><img :src="`${imageName}${imageUrl}${form.headPortrait}`"
            /></span>
          </div>
        </div>
        <div>
          <el-button @click="readit()">重 置</el-button>
          <el-button @click="close()">取消</el-button>
          <el-button type="primary" @click="submit()">修改</el-button>
        </div>
      </el-card>
    </div>
  </div>
</template>

<script>
import {getAdminEdit} from "@/api/table";

export default {
propt:[],
  data() {
    return {
      labelPosition: "right",
      formLabelWidth: "120px",
      adminList: [],
      imageUrl: "",
      imageName: "http://192.168.3.180:7001/",
      form: {
        id: null,
        name: "",
        password:"",
        headPortrait:"",

      },
    };
  },
  created() {
    
  },
  methods: {
     handleRemove(file, fileList) {
      console.log(file, fileList);
    },
    handlePreview(file) {
      console.log(file);
      this.form.headPortrait = file.response.data;
    },
    // // 上传图片/编辑图片
    // addImg(event) {
    //   const i = event.target.files[0];
    //   const formdata = new FormData();
    //   formdata.append("one", i);
    //   postupLoad(formdata).then((res) => {
    //     console.log(res.data);
    //     if (res.code === 0) {
    //       this.form.picture = res.data;
    //       console.log(this.form.picture);
    //     }
    //   });
    // },
    
    submit() {
       let params={};
      params.id = this.form.id;
      params.name = this.form.name;
      params.password = this.form.password;
      params.headPortrait = this.form.headPortrait;
      params.jurisdiction = this.form.jurisdiction;
      getAdminEdit(params).then((res) => {
        if (res.code === 0) {
          this.$message({
            message: "修改成功",
            type: "success",
            
          });
         
          // 把新添加的数据渲染到页面

        } else {
          this.$message.error("修改失败");
        }
        
      });
    //  this.$router.push({path:'/product/index'})
    },
    // 重置
    readit(){
      this.form.id='';
      this.form.name='';
      this.form.password='';
       this.form.headPortrait='';
       this.form.headPortrait='';
    },
    close(){
     this.$router.push({path:'/'})
    }

  },
};
</script>

<style lang="scss" scoped>
.box {
  width: 1000px;
  height: 600px;
  p {
    width: 50px;
    font-size: 18px;
    font-weight: bold;
    display: inline;
  }
  .xx {
    width: 30px;
    height: 30px;
    margin-left: 874px;
    cursor: pointer;
    font-size: 18px;
  }
  .box-card {
    font-size: 14px;
    .form {
      span {
        color: red;
        margin: 0 10px;
      }
      .s1 {
        width: 375px;
        height: 30px;
        text-indent: 10px;
        margin: 20px 20px 20px 0;
      }
      .s2 {
        width: 850px;
        text-indent: 10px;
        height: 30px;
        margin: 20px 20px 20px 0;
      }
      .tj {
        margin: 20px 0;
        .el-rate {
          display: inline;
          width: 200px;
          height: 50px;
        }
      }
      .tex {
         margin: 20px 0;
        .el-textarea {
          width: 860px;
         
        }
      }

      .uplod {
        margin: 20px 0;
        .upload-demo {
          width: 100px;
          display: inline;
        }
      }
    }
    .photo{
      display: inline;
    }
  }
}
img {
  width: 100px;
  height: 100px;
}
.dialog-footer {
  margin: 0 20px;
}
</style> 